<template>
  <div>
    <el-form
      ref="ruleForm"
      size="small"
      :model="ruleForm"
      :rules="rules"
      label-width="160px"
      label-position="right"
      :disabled="disabled"
    >
      <el-card class="box">
        <div class="box">
          <el-form-item
            label="选择客户"
            prop="customerId"
            label-width="100px"
          >
            <el-input
              readonly
              v-model="ruleForm.customerName"
              placeholder="请选择客户"
              @click.native="handleInputClick"
              suffix-icon="el-icon-edit"
              style="width: 200px;"
            ></el-input>
          </el-form-item>
        </div>
      </el-card>

      <el-card
        class="box"
        v-if="ruleForm.customerType.length"
      >
        <div class="title">
          客户基本信息
        </div>
        <template v-if="ruleForm.customerType === '01'">
          <el-row :gutter="10">
            <el-col :span="8">
              <el-form-item label-width="0">
                <div style="display: flex; flex-direction: column; ">
                  <div
                    class="up_sy_logo_div"
                    style="margin-left: 15px;"
                  >
                    <!--支持点击查看大图-->
                    <el-image
                      v-if="ruleForm.hrefn"
                      style="width:100%;height:200px;"
                      :src="ruleForm.hrefn"
                      :preview-src-list="ruleForm.hrefn ? [ruleForm.hrefn] : []"
                    ></el-image>
                  </div>
                </div>
              </el-form-item>
            </el-col>
            <el-col :span="16">
              <el-row :gutter="10">
                <el-col :span="12">
                  <el-form-item label="企业名称">
                    <el-input
                      v-model="ruleForm.enterprieName"
                      placeholder="请输入企业名称"
                      clearable
                      :style="{width: '100%'}"
                      disabled
                    >
                    </el-input>
                  </el-form-item>
                </el-col>
                <el-col :span="12">
                  <el-form-item label="成立时间">
                    <el-date-picker
                      v-model="ruleForm.companySetDate"
                      type="date"
                      format="yyyy-MM-dd"
                      value-format="yyyy-MM-dd"
                      :style="{width: '100%'}"
                      placeholder="请选择成立时间"
                      disabled
                    >
                    </el-date-picker>
                  </el-form-item>
                </el-col>
                <el-col :span="12">
                  <el-form-item label="统一代码">
                    <el-input
                      v-model="ruleForm.creditCode"
                      placeholder="请输入统一社会信用代码"
                      clearable
                      :style="{width: '100%'}"
                      disabled
                    >
                    </el-input>
                  </el-form-item>
                </el-col>
                <el-col :span="12">
                  <el-form-item label="企业性质">
                    <el-select
                      v-model="ruleForm.companyNature"
                      placeholder="请选择企业性质"
                      :style="{width: '100%'}"
                      disabled
                    >
                      <el-option
                        v-for="dict in natureList"
                        :key="dict.value"
                        :label="dict.label"
                        :value="dict.value"
                      />
                    </el-select>
                  </el-form-item>
                </el-col>
                <el-col :span="12">
                  <el-form-item label="营业期限开始日期">
                    <el-date-picker
                      v-model="ruleForm.businessStart"
                      type="date"
                      format="yyyy-MM-dd"
                      value-format="yyyy-MM-dd"
                      :style="{width: '100%'}"
                      placeholder="请选择开始日期"
                      disabled
                    >
                    </el-date-picker>
                  </el-form-item>
                </el-col>
                <el-col :span="12">
                  <el-form-item label="营业期限结束日期">
                    <el-date-picker
                      v-model="ruleForm.businessEnd"
                      type="date"
                      format="yyyy-MM-dd"
                      value-format="yyyy-MM-dd"
                      :style="{width: '100%'}"
                      placeholder="请选择结束日期"
                      disabled
                    >
                    </el-date-picker>
                  </el-form-item>
                </el-col>
                <el-col :span="12">
                  <el-form-item label="办公电话">
                    <el-input
                      placeholder="请输入办公电话"
                      v-model="ruleForm.companyTel"
                      maxlength="50"
                      disabled
                    >
                    </el-input>
                  </el-form-item>
                </el-col>
                <el-col :span="12">
                  <el-form-item label="注册资本">
                    <el-input
                      v-model="ruleForm.registerFund"
                      placeholder="请输入注册资本"
                      min="0"
                      :style="{width: '100%'}"
                      type="number"
                      disabled
                    >
                      <template slot="append">万元</template>
                    </el-input>
                  </el-form-item>
                </el-col>
                <el-col :span="24">
                  <el-form-item label="办公地址">
                    <el-input
                      type="textarea"
                      :rows="2"
                      placeholder="请输入办公地址"
                      v-model="ruleForm.companyWordaddress"
                      maxlength="200"
                      disabled
                    >
                    </el-input>
                  </el-form-item>
                </el-col>
                <el-col :span="24">
                  <el-form-item label="注册地址">
                    <el-input
                      type="textarea"
                      :rows="2"
                      placeholder="请输入注册地址"
                      v-model="ruleForm.companyAddress"
                      maxlength="200"
                      disabled
                      style="width: 100%;"
                    >
                    </el-input>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row :gutter="10">
                <el-col :span="12">
                  <el-form-item
                    label="实缴资本"
                    prop="realityFund"
                  >
                    <el-input
                      v-model.number="ruleForm.realityFund"
                      placeholder="请输入实缴资本"
                      min="0"
                      :style="{width: '100%'}"
                      type="number"
                      @blur="handleBlur($event, 'realityFund')"
                    >
                      <template slot="append">万元</template>
                    </el-input>
                  </el-form-item>
                </el-col>
                <el-col :span="12">
                  <el-form-item
                    label="法定代表人身份证号码"
                    prop="legalpersonCreditcode"
                  >
                    <el-input
                      v-model="ruleForm.legalpersonCreditcode"
                      placeholder="请输入法定代表人身份证号码"
                      :style="{width: '100%'}"
                    >
                    </el-input>
                  </el-form-item>
                </el-col>
                <el-col :span="12">
                  <el-form-item
                    label="法定代表人"
                    prop="legalpersonName"
                  >
                    <el-input
                      v-model="ruleForm.legalpersonName"
                      placeholder="请输入法定代表人"
                      :style="{width: '100%'}"
                    >
                    </el-input>
                  </el-form-item>
                </el-col>
                <el-col :span="12">
                  <el-form-item label="法定代表人身份证">
                    <el-row
                      :gutter="10"
                      style="display: flex;"
                    >
                      <el-col :span="12">
                        <div class="up_sy_logo_div">
                          <el-image
                            v-if="ruleForm.frontFn"
                            style="width:100%;height:75px;"
                            :src="ruleForm.frontFn"
                            :preview-src-list="ruleForm.frontFn ? [ruleForm.frontFn] : []"
                          ></el-image>
                        </div>
                        <div style="text-align: center">
                          <el-upload
                            :accept="pic_accept"
                            :action="uploadFileUrl + '/file/saveFile'"
                            :before-upload="beforeUpload"
                            :on-success="handleFrontSuccess"
                            :data="{fileRemark: '', fileuserInfo: ''}"
                            :show-file-list="false"
                          >
                            <el-button
                              style="margin:10px auto"
                              size="mini"
                              type="primary"
                            >上传身份证正面</el-button>
                          </el-upload>
                        </div>
                      </el-col>
                      <el-col :span="12">
                        <div class="up_sy_logo_div">
                          <el-image
                            v-if="ruleForm.backFn"
                            style="width:100%;height:75px;"
                            :src="ruleForm.backFn"
                            :preview-src-list="ruleForm.backFn ? [ruleForm.backFn] : []"
                          ></el-image>
                        </div>
                        <div style="text-align: center">
                          <el-upload
                            :accept="pic_accept"
                            :action="uploadFileUrl + '/file/saveFile'"
                            :before-upload="beforeUpload"
                            :on-success="handleBackSuccess"
                            :data="{fileRemark: '', fileuserInfo: ''}"
                            :show-file-list="false"
                          >
                            <el-button
                              style="margin:10px auto;"
                              size="mini"
                              type="primary"
                            >上传身份证反面</el-button>
                          </el-upload>
                        </div>
                      </el-col>
                    </el-row>
                  </el-form-item>
                </el-col>
                <el-col :span="12">
                  <el-form-item
                    label="实际控制人"
                    prop="controlPerson"
                  >
                    <el-input
                      v-model="ruleForm.controlPerson"
                      placeholder="请输入实际控制人"
                      :style="{width: '100%'}"
                    >
                    </el-input>
                  </el-form-item>
                </el-col>
                <el-col :span="12">
                  <el-form-item
                    label="项目联系人"
                    prop="projectPerson"
                  >
                    <el-input
                      v-model="ruleForm.projectPerson"
                      placeholder="请输入项目联系人"
                      :style="{width: '100%'}"
                    >
                    </el-input>
                  </el-form-item>
                </el-col>
                <el-col :span="12">
                  <el-form-item
                    label="项目联系人电话"
                    prop="projectPersonTel"
                  >
                    <el-input
                      v-model="ruleForm.projectPersonTel"
                      placeholder="请输入项目联系人电话"
                      :style="{width: '100%'}"
                    >
                    </el-input>
                  </el-form-item>
                </el-col>
                <el-col :span="12">
                  <el-form-item
                    label="职工人数"
                    prop="staffNumber"
                  >
                    <el-input-number
                      v-model="ruleForm.staffNumber"
                      controls-position="right"
                      :min="0"
                      :precision="0"
                      :style="{width: '100%'}"
                    ></el-input-number>
                  </el-form-item>
                </el-col>
                <el-col :span="12">
                  <el-form-item
                    label="实际控制人描述"
                    prop="controlPersonDesc"
                  >
                    <el-input
                      :rows="2"
                      type="textarea"
                      v-model="ruleForm.controlPersonDesc"
                      placeholder="请输入实际控制人描述"
                      maxlength="200"
                      :style="{width: '100%'}"
                    >
                    </el-input>
                  </el-form-item>
                </el-col>
                <el-col :span="12">
                  <el-form-item
                    label="经营范围"
                    prop="businessScope"
                  >
                    <el-input
                      :rows="2"
                      type="textarea"
                      v-model="ruleForm.businessScope"
                      placeholder="请输入经营范围"
                      maxlength="800"
                      :style="{width: '100%'}"
                    >
                    </el-input>
                  </el-form-item>
                </el-col>
              </el-row>
            </el-col>
          </el-row>
        </template>

        <template v-if="ruleForm.customerType === '02'">
          <el-row :gutter="10">
            <el-col :span="8">
              <el-form-item label-width="0">
                <div style="display: flex; flex-direction: column; ">
                  <div
                    class="up_sy_logo_div"
                    style="margin-left: 15px;"
                  >
                    <el-image
                      v-if="ruleForm.frontFn"
                      style="width:100%;height:175px;"
                      :src="ruleForm.frontFn"
                      :preview-src-list="ruleForm.frontFn ? [ruleForm.frontFn] : []"
                    ></el-image>
                  </div>
                </div>
              </el-form-item>
              <el-form-item label-width="0">
                <div style="display: flex; flex-direction: column; ">
                  <div
                    class="up_sy_logo_div"
                    style="margin-left: 15px;"
                  >
                    <el-image
                      v-if="ruleForm.backFn"
                      style="width:100%;height:175px;"
                      :src="ruleForm.backFn"
                      :preview-src-list="ruleForm.backFn ? [ruleForm.backFn] : []"
                    ></el-image>
                  </div>
                </div>
              </el-form-item>
            </el-col>
            <el-col :span="16">
              <el-row :gutter="10">
                <el-col :span="12">
                  <el-form-item label="姓名">
                    <el-input
                      v-model="ruleForm.customerName"
                      placeholder="请输入姓名"
                      clearable
                      disabled
                      :style="{width: '100%'}"
                    >
                    </el-input>
                  </el-form-item>
                </el-col>
                <el-col :span="12">
                  <el-form-item label="性别">
                    <el-select
                      v-model="ruleForm.customerSex"
                      placeholder="请选择性别"
                      :style="{width: '100%'}"
                      disabled
                    >
                      <el-option
                        v-for="dict in dict.type.sys_user_sex"
                        :key="dict.value"
                        :label="dict.label"
                        :value="dict.value"
                      ></el-option>
                    </el-select>
                  </el-form-item>
                </el-col>
                <el-col :span="12">
                  <el-form-item label="出生日期">
                    <el-date-picker
                      v-model="ruleForm.birthDate"
                      type="date"
                      placeholder="请选择出生日期"
                      format="yyyy-MM-dd"
                      value-format="yyyy-MM-dd"
                      disabled
                      :style="{width: '100%'}"
                    >
                    </el-date-picker>
                  </el-form-item>
                </el-col>
                <el-col :span="12">
                  <el-form-item label="身份证号码">
                    <el-input
                      v-model="ruleForm.customerCreditcode"
                      placeholder="请输入身份证号码"
                      clearable
                      :style="{width: '100%'}"
                      disabled
                    >
                    </el-input>
                  </el-form-item>
                </el-col>
                <el-col :span="12">
                  <el-form-item label="电话号码">
                    <el-input
                      v-model="ruleForm.customerPhone"
                      placeholder="请输入电话号码"
                      :style="{width: '100%'}"
                      disabled
                    >
                    </el-input>
                  </el-form-item>
                </el-col>
                <el-col :span="12">
                  <el-form-item label="民族">
                    <el-select
                      v-model="ruleForm.customerNation"
                      placeholder="请选择民族"
                      clearable
                      :style="{width: '100%'}"
                      disabled
                    >
                      <el-option
                        v-for="dict in dict.type.sys_nation"
                        :key="dict.value"
                        :label="dict.label"
                        :value="dict.value"
                      ></el-option>
                    </el-select>
                  </el-form-item>
                </el-col>
                <el-col :span="12">
                  <el-form-item label="学历">
                    <el-select
                      v-model="ruleForm.customerEduc"
                      placeholder="请选择学历"
                      clearable
                      :style="{width: '100%'}"
                      disabled
                    >
                      <el-option
                        v-for="dict in dict.type.sys_education"
                        :key="dict.value"
                        :label="dict.label"
                        :value="dict.value"
                      ></el-option>
                    </el-select>
                  </el-form-item>
                </el-col>
                <el-col :span="12">
                  <el-form-item label="婚姻状况">
                    <el-radio-group
                      v-model="ruleForm.customerMarriage"
                      disabled
                    >
                      <el-radio label="1">未婚</el-radio>
                      <el-radio label="0">已婚</el-radio>
                    </el-radio-group>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row :gutter="10">
                <el-col :span="12">
                  <el-form-item label="家庭住址">
                    <el-input
                      v-model="ruleForm.personalAddress"
                      placeholder="请输入家庭住址"
                      clearable
                      :style="{width: '100%'}"
                    ></el-input>
                  </el-form-item>
                </el-col>
                <el-col :span="12">
                  <el-form-item label="户籍所在地">
                    <el-input
                      v-model="ruleForm.personalHousehold"
                      placeholder="请输入户籍所在地"
                      clearable
                      :style="{width: '100%'}"
                    ></el-input>
                  </el-form-item>
                </el-col>
                <el-col :span="12">
                  <el-form-item label="工作单位">
                    <el-input
                      v-model="ruleForm.personalWorkaddress"
                      placeholder="请输入工作单位"
                      clearable
                      :style="{width: '100%'}"
                    ></el-input>
                  </el-form-item>
                </el-col>
                <el-col :span="12"></el-col>
                <el-col :span="12">
                  <el-form-item
                    label="项目联系人"
                    prop="projectPerson"
                  >
                    <el-input
                      v-model="ruleForm.projectPerson"
                      placeholder="请输入项目联系人"
                      clearable
                      :style="{width: '100%'}"
                    ></el-input>
                  </el-form-item>
                </el-col>
                <el-col :span="12">
                  <el-form-item
                    label="项目联系人电话"
                    prop="projectPersonTel"
                  >
                    <el-input
                      v-model="ruleForm.projectPersonTel"
                      placeholder="请输入项目联系人电话"
                      clearable
                      :style="{width: '100%'}"
                    ></el-input>
                  </el-form-item>
                </el-col>
              </el-row>
            </el-col>
          </el-row>
        </template>
      </el-card>

      <el-card class="box">
        <div class="title">
          客户基本信息表
          <el-link
            type="primary"
            @click="downloadTemplateFile(fileTemplate['finance_lease_data_list'].value)"
          >模板下载</el-link>
        </div>
        <el-upload
          class="upload-demo"
          :ref="'uploadCustFile'"
          :accept="fileAccept"
          :action="uploadFileUrl + '/file/saveFile'"
          :before-upload="beforeUpload"
          :on-change="handleCustChange"
          :on-success="handleCustFileSuccess"
          :on-remove="handleCustRemove"
          :file-list="ruleForm.fileList"
          :data="{fileRemark: '', fileuserInfo: ''}"
          :multiple="false"
          :auto-upload="true"
        >
          <el-button
            type="text"
            style="font-size: 16px;"
            icon="el-icon-upload2"
          ></el-button>
        </el-upload>
        <div v-if="ruleForm.fileList.length">
          <el-button
            size="mini"
            type="text"
            :disabled="false"
            @click="handleDownloadFile({fileUuid: ruleForm.customerinfoFile})"
          >下载</el-button>
          <el-button
            size="mini"
            type="text"
            :disabled="false"
            @click="handlePreviewFile({fileUuid: ruleForm.customerinfoFile})"
          >预览</el-button>
        </div>
      </el-card>

      <el-card class="box">
        <div class="title">
          企业（个人）经营情况
        </div>
        <el-row :gutter="10">
          <el-col :span="24">
            <el-form-item
              label="情况说明"
              prop="companyCondition"
              label-width="100px"
            >
              <el-input
                :rows="2"
                type="textarea"
                v-model="ruleForm.companyCondition"
                placeholder="请输入情况说明"
              ></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-table
              :data="ruleForm.companyConditionFileList"
              style="width: 100%;"
              border
            >
              <el-table-column
                label="附件名称"
                prop="fileName"
              >
                <template slot-scope="scope">
                  <el-input
                    v-model="scope.row.fileName"
                    placeholder="请输入附件名称"
                  ></el-input>
                </template>
              </el-table-column>
              <el-table-column
                label="附件说明"
                prop="fileRemark"
              >
                <template slot-scope="scope">
                  <el-input
                    v-model="scope.row.fileRemark"
                    placeholder="请输入附件说明"
                  ></el-input>
                </template>
              </el-table-column>
              <el-table-column
                label="附件上传"
                prop="fileList"
              >
                <template slot-scope="scope">
                  <el-upload
                    class="upload-demo"
                    :ref="'companyUploadFile' + '_' + scope.$index"
                    :accept="fileAccept"
                    :action="uploadFileUrl + '/file/saveFile'"
                    :before-upload="beforeUpload"
                    :on-change="(file, fileList) => handleChange(file, fileList, scope.row)"
                    :on-success="(response, file, fileList) => handleSuccess(response, file, fileList, scope.row, scope.$index, 'companyUploadFile'+ '_' + scope.$index)"
                    :on-remove="(file, fileList) => handleRemove(file, fileList, scope.row)"
                    :file-list="scope.row.fileList"
                    :data="{fileRemark: '', fileuserInfo: ''}"
                    :multiple="false"
                    :auto-upload="true"
                  >
                    <el-button
                      type="text"
                      style="font-size: 16px;"
                      icon="el-icon-upload2"
                    ></el-button>
                  </el-upload>
                </template>
              </el-table-column>
              <el-table-column
                label="操作"
                width="150px"
                v-if="ruleForm.companyConditionFileList[0].fileList.length > 0"
              >
                <template slot-scope="scope">
                  <el-button
                    size="mini"
                    type="text"
                    :disabled="false"
                    @click="handleDownloadFile(scope.row)"
                  >下载</el-button>
                  <el-button
                    size="mini"
                    type="text"
                    :disabled="false"
                    @click="handlePreviewFile(scope.row)"
                  >预览</el-button>
                </template>
              </el-table-column>
            </el-table>
          </el-col>
        </el-row>
      </el-card>
      <el-card class="box">
        <div class="title">
          资产状况
        </div>
        <el-row :gutter="10">
          <el-col :span="24">
            <el-form-item
              label="情况说明"
              prop="assetCondition"
              label-width="100px"
            >
              <el-input
                :rows="2"
                type="textarea"
                v-model="ruleForm.assetCondition"
                placeholder="请输入情况说明"
              ></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-table
              :data="ruleForm.assetConditionFileList"
              style="width: 100%;"
              border
            >
              <el-table-column
                label="附件名称"
                prop="fileName"
              >
                <template slot-scope="scope">
                  <el-input
                    v-model="scope.row.fileName"
                    placeholder="请输入附件名称"
                  ></el-input>
                </template>
              </el-table-column>
              <el-table-column
                label="附件说明"
                prop="fileRemark"
              >
                <template slot-scope="scope">
                  <el-input
                    v-model="scope.row.fileRemark"
                    placeholder="请输入附件说明"
                  ></el-input>
                </template>
              </el-table-column>
              <el-table-column
                label="附件上传"
                prop="fileList"
              >
                <template slot-scope="scope">
                  <el-upload
                    class="upload-demo"
                    :ref="'assetUploadFile' + '_' + scope.$index"
                    :accept="fileAccept"
                    :action="uploadFileUrl + '/file/saveFile'"
                    :before-upload="beforeUpload"
                    :on-change="(file, fileList) => handleChange(file, fileList, scope.row)"
                    :on-success="(response, file, fileList) => handleSuccess(response, file, fileList, scope.row, scope.$index, 'assetUploadFile'+ '_' + scope.$index)"
                    :on-remove="(file, fileList) => handleRemove(file, fileList, scope.row)"
                    :file-list="scope.row.fileList"
                    :data="{fileRemark: '', fileuserInfo: ''}"
                    :multiple="false"
                    :auto-upload="true"
                  >
                    <el-button
                      type="text"
                      style="font-size: 16px;"
                      icon="el-icon-upload2"
                    ></el-button>
                  </el-upload>
                </template>
              </el-table-column>
              <el-table-column
                label="操作"
                width="150px"
                v-if="ruleForm.assetConditionFileList[0].fileList.length > 0"
              >
                <template slot-scope="scope">
                  <el-button
                    size="mini"
                    type="text"
                    :disabled="false"
                    @click="handleDownloadFile(scope.row)"
                  >下载</el-button>
                  <el-button
                    size="mini"
                    type="text"
                    :disabled="false"
                    @click="handlePreviewFile(scope.row)"
                  >预览</el-button>
                </template>
              </el-table-column>
            </el-table>
          </el-col>
        </el-row>
      </el-card>
      <el-card class="box">
        <div class="title">
          客户征信情况
        </div>
        <el-row :gutter="10">
          <el-col :span="24">
            <el-form-item
              label="征信情况"
              prop="creditInfo"
              label-width="100px"
            >
              <el-radio-group v-model="ruleForm.creditInfo">
                <el-radio :label="1">很好</el-radio>
                <el-radio :label="2">良好</el-radio>
                <el-radio :label="3">一般</el-radio>
                <el-radio :label="4">差</el-radio>
              </el-radio-group>
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-form-item
              label="情况说明"
              prop="creditCondition"
              label-width="100px"
            >
              <el-input
                :rows="2"
                type="textarea"
                v-model="ruleForm.creditCondition"
                placeholder="请输入情况说明"
              ></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-table
              :data="ruleForm.creditConditionFileList"
              style="width: 100%;"
              border
            >
              <el-table-column
                label="附件名称"
                prop="fileName"
              >
                <template slot-scope="scope">
                  <el-input
                    v-model="scope.row.fileName"
                    placeholder="请输入附件名称"
                  ></el-input>
                </template>
              </el-table-column>
              <el-table-column
                label="附件说明"
                prop="fileRemark"
              >
                <template slot-scope="scope">
                  <el-input
                    v-model="scope.row.fileRemark"
                    placeholder="请输入附件说明"
                  ></el-input>
                </template>
              </el-table-column>
              <el-table-column
                label="附件上传"
                prop="fileList"
              >
                <template slot-scope="scope">
                  <el-upload
                    class="upload-demo"
                    :ref="'creditUploadFile' + '_' + scope.$index"
                    :accept="fileAccept"
                    :action="uploadFileUrl + '/file/saveFile'"
                    :before-upload="beforeUpload"
                    :on-change="(file, fileList) => handleChange(file, fileList, scope.row)"
                    :on-success="(response, file, fileList) => handleSuccess(response, file, fileList, scope.row, scope.$index, 'creditUploadFile'+ '_' + scope.$index)"
                    :on-remove="(file, fileList) => handleRemove(file, fileList, scope.row)"
                    :file-list="scope.row.fileList"
                    :data="{fileRemark: '', fileuserInfo: ''}"
                    :multiple="false"
                    :auto-upload="true"
                  >
                    <el-button
                      type="text"
                      style="font-size: 16px;"
                      icon="el-icon-upload2"
                    ></el-button>
                  </el-upload>
                </template>
              </el-table-column>
              <el-table-column
                label="操作"
                width="150px"
                v-if="ruleForm.creditConditionFileList[0].fileList.length > 0"
              >
                <template slot-scope="scope">
                  <el-button
                    size="mini"
                    type="text"
                    :disabled="false"
                    @click="handleDownloadFile(scope.row)"
                  >下载</el-button>
                  <el-button
                    size="mini"
                    type="text"
                    :disabled="false"
                    @click="handlePreviewFile(scope.row)"
                  >预览</el-button>
                </template>
              </el-table-column>
            </el-table>
          </el-col>
        </el-row>
      </el-card>
      <el-card class="box">
        <div class="title">
          客户尽调细审报告
        </div>
        <el-row :gutter="10">
          <el-col :span="24">
            <el-form-item
              label="情况说明"
              prop="surveyCondition"
              label-width="100px"
            >
              <el-input
                :rows="2"
                type="textarea"
                v-model="ruleForm.surveyCondition"
                placeholder="请输入情况说明"
              ></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-table
              :data="ruleForm.surveyConditionFileList"
              style="width: 100%;"
              border
            >
              <el-table-column
                label="附件名称"
                prop="fileName"
              >
                <template slot-scope="scope">
                  <el-input
                    v-model="scope.row.fileName"
                    placeholder="请输入附件名称"
                  ></el-input>
                </template>
              </el-table-column>
              <el-table-column
                label="附件说明"
                prop="fileRemark"
              >
                <template slot-scope="scope">
                  <el-input
                    v-model="scope.row.fileRemark"
                    placeholder="请输入附件说明"
                  ></el-input>
                </template>
              </el-table-column>
              <el-table-column
                label="附件上传"
                prop="fileList"
              >
                <template slot-scope="scope">
                  <el-upload
                    class="upload-demo"
                    :ref="'surveyUploadFile' + '_' + scope.$index"
                    :accept="fileAccept"
                    :action="uploadFileUrl + '/file/saveFile'"
                    :before-upload="beforeUpload"
                    :on-change="(file, fileList) => handleChange(file, fileList, scope.row)"
                    :on-success="(response, file, fileList) => handleSuccess(response, file, fileList, scope.row, scope.$index, 'surveyUploadFile'+ '_' + scope.$index)"
                    :on-remove="(file, fileList) => handleRemove(file, fileList, scope.row)"
                    :file-list="scope.row.fileList"
                    :data="{fileRemark: '', fileuserInfo: ''}"
                    :multiple="false"
                    :auto-upload="true"
                  >
                    <el-button
                      type="text"
                      style="font-size: 16px;"
                      icon="el-icon-upload2"
                    ></el-button>
                  </el-upload>
                </template>
              </el-table-column>
              <el-table-column
                label="操作"
                width="150px"
                v-if="ruleForm.surveyConditionFileList[0].fileList.length > 0"
              >
                <template slot-scope="scope">
                  <el-button
                    size="mini"
                    type="text"
                    :disabled="false"
                    @click="handleDownloadFile(scope.row)"
                  >下载</el-button>
                  <el-button
                    size="mini"
                    type="text"
                    :disabled="false"
                    @click="handlePreviewFile(scope.row)"
                  >预览</el-button>
                </template>
              </el-table-column>
            </el-table>
          </el-col>
        </el-row>
      </el-card>
      <el-card class="box">
        <div class="title">
          担保信息说明
        </div>
        <el-row :gutter="10">
          <el-col :span="24">
            <el-form-item
              label="情况说明"
              prop="guranteeCondition"
              label-width="100px"
            >
              <el-input
                :rows="2"
                type="textarea"
                v-model="ruleForm.guranteeCondition"
                placeholder="请输入情况说明"
              ></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-table
              :data="ruleForm.guranteeConditionFileList"
              style="width: 100%;"
              border
            >
              <el-table-column
                label="附件名称"
                prop="fileName"
              >
                <template slot-scope="scope">
                  <el-input
                    v-model="scope.row.fileName"
                    placeholder="请输入附件名称"
                  ></el-input>
                </template>
              </el-table-column>
              <el-table-column
                label="附件说明"
                prop="fileRemark"
              >
                <template slot-scope="scope">
                  <el-input
                    v-model="scope.row.fileRemark"
                    placeholder="请输入附件说明"
                  ></el-input>
                </template>
              </el-table-column>
              <el-table-column
                label="附件上传"
                prop="fileList"
              >
                <template slot-scope="scope">
                  <el-upload
                    class="upload-demo"
                    :ref="'guranteeUploadFile' + '_' + scope.$index"
                    :accept="fileAccept"
                    :action="uploadFileUrl + '/file/saveFile'"
                    :before-upload="beforeUpload"
                    :on-change="(file, fileList) => handleChange(file, fileList, scope.row)"
                    :on-success="(response, file, fileList) => handleSuccess(response, file, fileList, scope.row, scope.$index, 'guranteeUploadFile'+ '_' + scope.$index)"
                    :on-remove="(file, fileList) => handleRemove(file, fileList, scope.row)"
                    :file-list="scope.row.fileList"
                    :data="{fileRemark: '', fileuserInfo: ''}"
                    :multiple="false"
                    :auto-upload="true"
                  >
                    <el-button
                      type="text"
                      style="font-size: 16px;"
                      icon="el-icon-upload2"
                    ></el-button>
                  </el-upload>
                </template>
              </el-table-column>
              <el-table-column
                label="操作"
                width="150px"
                v-if="ruleForm.guranteeConditionFileList[0].fileList.length > 0"
              >
                <template slot-scope="scope">
                  <el-button
                    size="mini"
                    type="text"
                    :disabled="false"
                    @click="handleDownloadFile(scope.row)"
                  >下载</el-button>
                  <el-button
                    size="mini"
                    type="text"
                    :disabled="false"
                    @click="handlePreviewFile(scope.row)"
                  >预览</el-button>
                </template>
              </el-table-column>
            </el-table>
          </el-col>
        </el-row>
      </el-card>
      <el-card class="box">
        <div class="title">
          结论：（该客户风险是否可控，是否建议销售）
        </div>
        <el-form-item
          label="结论"
          label-width="100px"
          prop="admintConclusion"
        >
          <el-input
            :rows="2"
            type="textarea"
            v-model="ruleForm.admintConclusion"
            placeholder="请输入结论"
          ></el-input>
        </el-form-item>
      </el-card>
      <el-card
        class="box"
        v-if="['审批'].includes(templateType) && (options.enabledEditDoc || options.docPermission.admitRateEdit)"
      >
        <template v-if="customerScoreShow">
          <div class="title">
            客户评分授信
          </div>
          <el-descriptions
            :column="1"
            border
          >
            <el-descriptions-item :label="ruleForm.customerName">（评分: {{ configCreditLevelListData.creditScore }}分，{{ configCreditLevelListData.creditLevel }}级，信用系数：{{ configCreditLevelListData.creditFactor }}）</el-descriptions-item>
          </el-descriptions>
          <el-descriptions
            :column="2"
            border
            style="margin-bottom: 10px;"
          >
            <el-descriptions-item label="授信额度">{{ formatMoney(customerCreditInfo.creditLimit) }}元</el-descriptions-item>
            <el-descriptions-item label="剩余授信额度">{{ formatMoney(customerCreditInfo.availableLimit) }}元</el-descriptions-item>
            <el-descriptions-item label="上次授信日期">{{ customerCreditInfo.availableBeginTime }}</el-descriptions-item>
            <el-descriptions-item label="有效期至">{{ customerCreditInfo.availableEndTime }}</el-descriptions-item>
          </el-descriptions>
        </template>
        <template v-if="!customerScoreShow || (customerCreditInfo && customerCreditInfo.isEnd === '1')">
          <div style="display: flex; align-items: center;">
            <div class="title">
              客户评分授信
            </div>
            <el-button
              style="margin-left: 10px;"
              size="mini"
              type="primary"
              :disabled="false"
              @click="handleScoreOpen"
            >评分授信</el-button>
          </div>
        </template>
      </el-card>
      <el-card v-if="!disabled">
        <div>
          <el-form-item
            label="下一节点审批人"
            prop="targetUserName"
            label-width="120px"
          >
            <el-radio-group v-model="ruleForm.targetUserName">
              <el-radio
                :label="item.userName"
                v-for="item in approveList"
                :key="item.userName"
              >{{ item.nickName }}</el-radio>
            </el-radio-group>
          </el-form-item>
        </div>
        <div>
          <el-button
            type="info"
            size="mini"
            @click="handleSubmit('0')"
          >保存草稿</el-button>
          <el-button
            type="primary"
            size="mini"
            @click="handleSubmit('1')"
          >确认提交</el-button>
        </div>
      </el-card>

      <el-card v-if="options.docPermission.admitRateEdit">
        <el-form
          ref="ruleFormReview"
          size="small"
          :model="ruleFormReview"
          :rules="rulesReview"
          label-width="160px"
          label-position="right"
        >
          <el-row :gutter="10">
            <el-col :span="8">
              <el-form-item
                label="客户预评级结果"
                prop="admitRate"
              >
                <el-select
                  v-model="ruleFormReview.admitRate"
                  placeholder="请选择客户预评级结果"
                  style="width: 100%;"
                >
                  <el-option
                    label="A"
                    value="A"
                  ></el-option>
                  <el-option
                    label="B"
                    value="B"
                  ></el-option>
                  <el-option
                    label="C"
                    value="C"
                  ></el-option>
                  <el-option
                    label="D"
                    value="D"
                  ></el-option>
                </el-select>
              </el-form-item>
            </el-col>
          </el-row>
        </el-form>
      </el-card>
    </el-form>
    <CustomTable
      :templateName="templateName"
      :queryData="queryData"
      ref="customTableRef"
      @ok="handleOk"
    ></CustomTable>
    <PreviewFile
      :fileType="fileType"
      :fileUrl="fileUrl"
      :dialogVisible="dialogFileVisible"
      @cancel="dialogFileVisible = false"
    />
  </div>
</template>

<script>
import { downloadFile, previewFile, formatMoney } from '@/utils/utils'
import { validatePhone, validateIdCard } from '@/utils/validate'
import { getNodeUsers, customerInfo, queryFiles, customerCreditInfo, configCreditLevelList } from '@/api/processManage/approveForms'
import PreviewFile from '@/components/PreviewFile/index'
import CustomTable from "./CustomTable"

export default {
  dicts: ['enabled_file_upload_types', 'sys_user_sex', 'sys_nation', 'sys_education', 'sys_file_template'],
  props: ['templateId', 'doc', 'flowNo', 'disabled', 'options', 'templateName', 'templateType'],
  components: {
    PreviewFile,
    CustomTable
  },
  data() {
    return {
      uploadFileUrl: process.env.VUE_APP_BASE_API,
      ruleForm: {
        hrefn: require("@/assets/images/space.png"),
        frontFn: require("@/assets/images/space.png"),
        backFn: require("@/assets/images/space.png"),

        customerId: '',
        customerName: '',
        customerType: '',
        realityFund: '',
        legalpersonCreditcode: '',
        legalidcardFront: '', // 正面
        legalidcardReverse: '', // 反面
        legalpersonName: '',
        controlPerson: '',
        projectPerson: '',
        projectPersonTel: '',
        staffNumber: 0,
        controlPersonDesc: '',
        businessScope: '',

        personalAddress: '',
        personalHousehold: '',
        personalWorkaddress: '',

        customerinfoFile: '',
        fileList: [],

        companyCondition: '',
        companyConditionFileList: [{ fileList: [], fileName: '', fileRemark: '', fileUuid: '' }],
        companyConditionFile: '',

        assetCondition: '',
        assetConditionFileList: [{ fileList: [], fileName: '', fileRemark: '', fileUuid: '' }],
        assetConditionFile: '',

        creditInfo: '',
        creditCondition: '',
        creditConditionFileList: [{ fileList: [], fileName: '', fileRemark: '', fileUuid: '' }],
        creditConditionFile: '',

        surveyCondition: '',
        surveyConditionFileList: [{ fileList: [], fileName: '', fileRemark: '', fileUuid: '' }],
        surveyConditionFile: '',

        guranteeCondition: '',
        guranteeConditionFileList: [{ fileList: [], fileName: '', fileRemark: '', fileUuid: '' }],
        guranteeConditionFile: '',

        admintConclusion: '',
        targetUserName: ''
      },
      rules: {
        customerId: [{ required: true, message: '请选择客户', trigger: 'change' }],

        realityFund: [{ required: true, message: '请输入实缴资本', trigger: 'blur' }],
        legalpersonCreditcode: [{ required: true, validator: validateIdCard, trigger: 'blur' }],
        legalpersonName: [{ required: true, message: '请输入法定代表人', trigger: 'blur' }],
        controlPerson: [{ required: true, message: '请输入实际控制人', trigger: 'blur' }],
        projectPerson: [{ required: true, message: '请输入项目联系人', trigger: 'blur' }],
        projectPersonTel: [{ required: true, validator: validatePhone, trigger: 'blur' }],
        staffNumber: [{ required: true, message: '请输入职工人数', trigger: 'blur' }],
        controlPersonDesc: [{ required: true, message: '请输入实际控制人描述', trigger: 'blur' }],
        businessScope: [{ required: true, message: '请输入经营范围', trigger: 'blur' }],
        companyCondition: [{ required: true, message: '请输入情况说明', trigger: 'blur' }],
        assetCondition: [{ required: true, message: '请输入情况说明', trigger: 'blur' }],
        creditInfo: [{ required: true, message: '请选择征信情况', trigger: 'change' }],
        creditCondition: [{ required: true, message: '请输入情况说明', trigger: 'blur' }],
        surveyCondition: [{ required: true, message: '请输入情况说明', trigger: 'blur' }],
        guranteeCondition: [{ required: true, message: '请输入情况说明', trigger: 'blur' }],
        admintConclusion: [{ required: true, message: '请输入结论', trigger: 'blur' }],
        targetUserName: [{ required: true, message: '请选择下一节点审批人', trigger: 'blur' }],
      },
      approveList: [],
      natureList: [],
      fileAccept: '',
      fileUrl: '',
      fileType: '',
      dialogFileVisible: false,
      pic_accept: ".jpg,.png,.jpeg,.bmp",
      pic_maxsize: 10,//单位MB

      isFormValid: false,
      ruleFormReview: {
        admitRate: ''
      },
      rulesReview: {
        admitRate: [{ required: true, message: '请选择客户预评级结果', trigger: 'change' }]
      },
      queryData: {
        isAdmit: '0'
      },

      configCreditLevelListData: {},
      customerCreditInfo: {},
      customerScoreShow: true,

      fileTemplate: {},
    }
  },
  created() {
    this.$nextTick(() => {
      this.$refs['ruleForm'].resetFields();
    })
    this.handleGetNodeUsers()
  },
  watch: {
    doc: {
      handler(val) {
        if (JSON.stringify(val) !== '{}') {
          let params = JSON.parse(JSON.stringify(val))
          this.ruleForm = {
            ...params,
            registerFund: Number((params.registerFund / 10000).toFixed(4)),
            realityFund: Number((params.realityFund / 10000).toFixed(4)),
          };
          
          const keys = ['companyConditionFileList', 'assetConditionFileList', 'creditConditionFileList', 'surveyConditionFileList', 'guranteeConditionFileList'];
          keys.forEach(key => {
            this.ruleForm[key] = this.processFileList(params[key]);
          });

          this.ruleFormReview.admitRate = params.admitRate
          this.handleCustomerInfo()
        }
        if (this.$refs.ruleFormReview) {
          this.$nextTick(() => {
            this.$refs.ruleFormReview.resetFields();
          })
        }
      },
      deep: true
    },
    'dict.type.sys_file_template': {
      deep: true,
      handler(newValue) {
        if (newValue && newValue.length > 0) {
          newValue.forEach(item => {
            item.remark = item.raw.remark
            this.fileTemplate[item.label] = item
          });
        }
      },
      immediate: true,
    },
    'dict.type.enabled_file_upload_types': {
      deep: true,
      handler(newValue) {
        if (newValue && newValue.length > 0) {
          this.fileAccept = newValue.map(item => {
            let updatedValue = item.value.split(',').map(item => `.${item}`).join(',');
            return updatedValue;
          }).join(',');
        }
      },
      immediate: true,
    },
    'ruleForm.customerId': {
      deep: true,
      handler(newValue) {
        if (String(newValue).length) {
          this.handleCustomerCreditInfo()
        }
      },
      immediate: true,
    }
  },
  methods: {
    formatMoney,
    // 下载模板文件
    downloadTemplateFile(url) {
      this.$message.success('下载已开始，请耐心等待，请勿重复点击')
      const a = document.createElement('a') // 创建一个<a></a>标签
      a.href = url // 下载文件地址
      // a.download = '太重集团（工起）合同管理平台使用培训手册.pptx' // 下载文件名字
      a.style.display = 'none'
      document.body.appendChild(a) // 将a标签追加到文档对象中
      a.click() // 模拟点击<a>标签,触发<a>标签的href的读取,浏览器自动下载文件
      a.remove() // 用完删除a标签
    },
    processFileList(paramsList) {
      if (paramsList.length === 0) {
        return [{ fileList: [], fileName: '', fileRemark: '', fileUuid: '' }];
      }

      return paramsList.map(item => ({
        fileList: [{ name: item.fileName }],
        fileName: item.fileName,
        fileRemark: item.fileRemark,
        fileUuid: item.fileUuid
      }));
    },
    handleScoreOpen() {
      this.$router.push({
        name: 'ApproveForms'
      })
      this.$store.commit('SET_PROCEDURE', JSON.stringify({
        templateType: '发起',
        templateName: '评分授信',
        templateId: 'CREDIT_RATING_SCORING',
        paramsData: {
          flowNo: ''
        }
      }))
      localStorage.setItem("formDoc", JSON.stringify({
        custName: this.ruleForm.customerName,
        custNo: this.ruleForm.customerId,
        customerId: this.ruleForm.customerId,
        customerType: this.ruleForm.customerType,
        creditScoreId: '',
        approveId: '',
        totalConlusuin: '',
        creditLimit: '',
        status: '',
        targetUserName: '',
        flag: '0',
        scoreConlusuin: []
      }));

      this.$router.go(0)
    },
    // 获取评分授信信息
    handleCustomerCreditInfo() {
      customerCreditInfo({
        customerId: this.ruleForm.customerId
      }).then(res => {
        this.customerScoreShow = res.data != null ? true : false
        this.customerCreditInfo = res.data
        if (this.customerScoreShow) {
          configCreditLevelList(res.data.levelFinalId).then(ret => {
            this.configCreditLevelListData = ret.data
          })
        }
      })
    },
    handleGetNodeUsers() {
      getNodeUsers({
        templateId: this.templateId,
        flowNo: '',
        targetAction: 'TO_NEXT',
        targetNodeId: ''
      }).then(res => {
        this.approveList = res.data
        this.ruleForm.targetUserName = res.data.length ? res.data[0].userName : ''
      })
    },
    handleInputClick() {
      if (!this.disabled) {
        this.$refs.customTableRef.sync()
      }
    },
    handleOk(row) {
      this.$refs.ruleForm.clearValidate();
      this.ruleForm.customerName = row.customerName
      this.ruleForm.customerId = row.customerId
      this.ruleForm.customerType = row.customerType

      this.ruleForm.personalAddress = ''
      this.ruleForm.personalHousehold = ''
      this.ruleForm.personalWorkaddress = ''
      this.ruleForm.projectPerson = ''
      this.ruleForm.projectPersonTel = ''
      this.ruleForm = {
        ...this.ruleForm,
        ...row,
        registerFund: Number((row.registerFund / 10000).toFixed(4))
      }
      this.$refs.ruleForm.resetFields();
      this.handleQueryFiles(row)
    },
    handleQueryFiles(row) {
      this.ruleForm.hrefn = require("@/assets/images/space.png")
      this.ruleForm.frontFn = require("@/assets/images/space.png")
      this.ruleForm.backFn = require("@/assets/images/space.png")

      if (row.customerType === '01') {
        if (row.licenseId) {
          queryFiles({
            fileId: row.licenseId,
            modelKey: 'original'
          }).then(res => {
            const blob = new Blob([res], { type: "image/jpeg" })
            const fileUrl = window.URL.createObjectURL(blob);
            this.ruleForm.hrefn = fileUrl
          })
        }
        if (row.legalidcardFront) {
          queryFiles({
            fileId: row.legalidcardFront,
            modelKey: 'original'
          }).then(res => {
            const blob = new Blob([res], { type: "image/jpeg" })
            const fileUrl = window.URL.createObjectURL(blob);
            this.ruleForm.frontFn = fileUrl
          })
        }
        if (row.legalidcardReverse) {
          queryFiles({
            fileId: row.legalidcardReverse,
            modelKey: 'original'
          }).then(res => {
            const blob = new Blob([res], { type: "image/jpeg" })
            const fileUrl = window.URL.createObjectURL(blob);
            this.ruleForm.backFn = fileUrl
          })
        }
      } else {
        if (row.idCardFront) {
          queryFiles({
            fileId: row.idCardFront,
            modelKey: 'original'
          }).then(res => {
            const blob = new Blob([res], { type: "image/jpeg" })
            const fileUrl = window.URL.createObjectURL(blob);
            this.ruleForm.frontFn = fileUrl
          })
        }
        if (row.idCardReverse) {
          queryFiles({
            fileId: row.idCardReverse,
            modelKey: 'original'
          }).then(res => {
            const blob = new Blob([res], { type: "image/jpeg" })
            const fileUrl = window.URL.createObjectURL(blob);
            this.ruleForm.backFn = fileUrl
          })
        }
      }
    },
    handleCustomerInfo() {
      customerInfo({
        customerId: this.ruleForm.customerId
      }).then(res => {
        this.ruleForm = {
          ...res.data,
          ...this.ruleForm
        }
        this.handleQueryFiles(this.ruleForm)
      })
    },
    handleBlur(e, type) {
      let num = isNaN(e.target.valueAsNumber) ? '' : e.target.valueAsNumber
      this.ruleForm[type] = typeof num != 'string' ? num < 0 ? '' : num.toFixed(4) : ''
    },
    handleFrontSuccess(response, file) {
      this.ruleForm.frontFn = URL.createObjectURL(file.raw);
      this.ruleForm.legalidcardFront = response.data.fileUuid
    },
    handleBackSuccess(response, file) {
      this.ruleForm.backFn = URL.createObjectURL(file.raw);
      this.ruleForm.legalidcardReverse = response.data.fileUuid
    },

    // 上传客户基本信息表
    handleCustChange(file, fileList) {
      if (fileList.length > 0) {
        this.ruleForm.fileList = [fileList[fileList.length - 1]];
      } else {
        this.ruleForm.fileList = [];
      }
      return true
    },

    handleCustFileSuccess(response, file) {
      let uid = file.uid
      let idx = this.$refs.uploadCustFile.uploadFiles.findIndex(item => item.uid == uid)
      if (response.code != 200) {
        this.$modal.msgError('文件格式或命名存在特殊字符,请检查后重新上传!');
        this.$refs.uploadCustFile.uploadFiles.splice(idx, 1)
        return true;
      }
      const { fileUuid } = response.data;
      this.ruleForm.customerinfoFile = fileUuid;
      this.ruleForm.fileList.push(file);
    },
    handleCustRemove(file, fileList) {
      this.ruleForm.fileList = fileList
      if (!this.ruleForm.fileList.length) {
        this.ruleForm.customerinfoFile = ''
      }
    },

    beforeUpload(file) {
      if (file.size / 1024 / 1024 > 50) {
        this.$message.error('文件不能超过50M！');
        return false;
      }
      return true;
    },
    handleChange(file, fileList, v) {
      if (fileList.length > 0) {
        v.fileList = [fileList[fileList.length - 1]];
      } else {
        v.fileList = [];
      }
      return true
    },
    handleSuccess(response, file, fileList, v, i, uploadName) {
      let uid = file.uid
      let idx = this.$refs[uploadName].uploadFiles.findIndex(item => item.uid == uid)
      if (response.code != 200) {
        this.$modal.msgError('文件格式或命名存在特殊字符,请检查后重新上传!');
        this.$refs[uploadName].uploadFiles.splice(idx, 1)
        return true;
      }

      const { fileName: originalFileName, fileUuid } = response.data;
      v.fileName = originalFileName.split('.').shift();
      v.fileUuid = fileUuid;
      v.fileList.push(file);
    },
    handleRemove(file, fileList, v) {
      v.fileList = fileList
      if (!v.fileList.length) {
        v.fileUuid = ''
        v.fileName = ''
        v.fileRemark = ''
      }
    },
    // 文件下载
    async handleDownloadFile(row) {
      downloadFile({ fileUuid: row.fileUuid });
    },
    // 文件预览
    async handlePreviewFile(row) {
      try {
        const { arrayBuffer, fileType } = await previewFile({ fileUuid: row.fileUuid });
        this.fileUrl = arrayBuffer;
        this.fileType = fileType;
        this.dialogFileVisible = true
      } catch (error) {
        this.$modal.msgError(error.message);
      }
    },

    handleSubmit(flag) {
      this.ruleForm.flag = flag
      this.$refs['ruleForm'].validate((valid) => {
        if (valid) {
          const companyConditionFile = this.ruleForm.companyConditionFileList.map(item => item.fileUuid).join(',')
          const companyConditionFileList = this.ruleForm.companyConditionFileList.filter(item => item.fileUuid.length)

          const assetConditionFile = this.ruleForm.assetConditionFileList.map(item => item.fileUuid).join(',')
          const assetConditionFileList = this.ruleForm.assetConditionFileList.filter(item => item.fileUuid.length)

          const creditConditionFile = this.ruleForm.creditConditionFileList.map(item => item.fileUuid).join(',')
          const creditConditionFileList = this.ruleForm.creditConditionFileList.filter(item => item.fileUuid.length)

          const surveyConditionFile = this.ruleForm.surveyConditionFileList.map(item => item.fileUuid).join(',')
          const surveyConditionFileList = this.ruleForm.surveyConditionFileList.filter(item => item.fileUuid.length)

          const guranteeConditionFile = this.ruleForm.guranteeConditionFileList.map(item => item.fileUuid).join(',')
          const guranteeConditionFileList = this.ruleForm.guranteeConditionFileList.filter(item => item.fileUuid.length)

          this.$emit('submit', {
            ...this.ruleForm,
            realityFund: Number((this.ruleForm.realityFund * 10000).toFixed(2)),
            registerFund: Number((this.ruleForm.registerFund * 10000).toFixed(2)),
            companyConditionFile,
            companyConditionFileList,
            assetConditionFile,
            assetConditionFileList,
            creditConditionFile,
            creditConditionFileList,
            surveyConditionFile,
            surveyConditionFileList,
            guranteeConditionFile,
            guranteeConditionFileList,

            flag,
            flowNo: this.flowNo || ''
          });
        } else {
          return false
        }
      })
    },

    handleSubmitAdditional() {
      if (!this.customerScoreShow || this.customerCreditInfo && this.customerCreditInfo.isEnd === '1') {
        this.$modal.msgError('请先进行评分授信');
        return;
      }
      this.$refs['ruleFormReview'].validate((valid) => {
        this.isFormValid = valid
      })
    }
  }
}
</script>

<style lang="scss" scoped>
.box {
  margin-bottom: 20px;
  .title {
    margin-bottom: 10px;
    font-size: 14px;
    font-weight: bold;
  }
  .box-card {
    margin-bottom: 20px;
  }

  .upload-demo {
    display: flex;
    align-items: center;
    :deep(.el-upload-list) {
      width: 90%;
      .el-upload-list__item {
        margin-top: 0 !important;
      }
    }
  }
}
:deep(.el-descriptions-item__label) {
  width: 120px;
}
</style>